how to make a triangle in css

109

// css clip
<div id="triangle"></div>

#triangle {
	background-color: #003BDE;
	clip-path: polygon(50% 0, 100% 100%, 0 100%);
	width: 100px;
	height: 100px;
}
#triangle {
    width: 0;
    height: 0;
    border-left: 18px solid transparent;
    border-right: 18px solid transparent;
    border-bottom: 30px solid blue;
}
#triangle-up {
  width: 0;
  height: 0;
  border-left: 50px solid transparent;
  border-right: 50px solid transparent;
  border-bottom: 100px solid red;
}

Comments

Submit
0 Comments